const {resolve} = require("path");
//html编译
const HtmlWebpackPlugin = require("html-webpack-plugin")
//css 提取成一个文件
const MiniCssExtractPlugin = require("mini-css-extract-plugin")
// // css 压缩 webpack 4
// const OptimizeCssAssetsWebpackPlugin = require("optimize-css-assets-webpack-plugin")
// const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');

module.exports = {
    mode:"development",
    entry:"./src/index.js",
    output:{
        filename:"js/bundle.js",
        path:resolve(__dirname,"build")
    },
    module:{
        rules:[
            {
                test:/\.css$/,
                use:
                [
                   // "style-loader",
                   //用这个自带的加载成单个css文件
                   MiniCssExtractPlugin.loader,
                   "css-loader"
                ],
                exclude:/node_module/
            },

        ]
    },
    plugins:[
        new HtmlWebpackPlugin({
            template:"./src/index.html"
        }),
        new MiniCssExtractPlugin({
            filename:"css/main.css"
        }),
    ],
}